<template>
  <div>
    <div class="title">
      <el-row>
        <el-col :span="1" style="width: 50px;">
          <span style="color:#757575;">位置 : </span>
        </el-col>
        <el-col :span="20">
          <span @click="tableshow" class="hand" :class="{'textactive' : !secondshow}">已推简历</span>
          <span v-if="secondshow" :class="{'textactive' : secondshow}"> > {{secondtitle}}</span>
        </el-col>
      </el-row>
    </div>
    <div class="posttable" v-show="!addShow">
      <el-row type="flex" justify="center" style="min-height: 50px;
    line-height: 50px;">
        <el-col :span="23">
          <el-row>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
              <el-select v-model="name" placeholder="请选择推送人" style="margin-right: 10px;" @change="selectname">
                <el-option-group
                  v-for="(group,index) in namelist"
                  :key="index"
                  :label="group.label">
                  <el-option
                    v-for="(item,index1) in group.options"
                    :key="index1"
                    :label="item"
                    :value="item">
                  </el-option>
                </el-option-group>
              </el-select>
            </el-col>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
                              <el-select v-model="customerName" placeholder="请选择推送客户" style="margin-right: 10px;" @change="selectcustomerName">
                                  <el-option
                                    v-for="(item,index1) in customerNamelist"
                                    :key="index1"
                                    :label="item"
                                    :value="item">
                                  </el-option>
                              </el-select>
            </el-col>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
                              <el-select v-model="positionName" placeholder="请选择推送职位" style="margin-right: 10px;" @change="selectpositionName">
                                  <el-option
                                    v-for="(item,index1) in positionNamelist"
                                    :key="index1"
                                    :label="item"
                                    :value="item">
                                  </el-option>
                              </el-select>
            </el-col>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
                              <el-select v-model="area" placeholder="请选择地区" style="margin-right: 10px;" @change="selectarea">
                                  <el-option
                                    v-for="(item,index1) in arealist"
                                    :key="index1"
                                    :label="item"
                                    :value="item">
                                  </el-option>
                              </el-select>
            </el-col>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
                              <el-date-picker
                                v-model="time"
                                type="date"
                                placeholder="请选择推送时间"
                                @change="selecttime"
                                value-format="yyyy-MM-dd"
                                :picker-options="pickerOptionsDate">
                              </el-date-picker>
            </el-col>
            <el-col class="interviewtrack" style="margin-right: 5px;width: 180px;">
                              <el-select v-model="contact" placeholder="请选择联系方式" clearable style="margin-right: 10px;" @change="selectcontact">
                                  <el-option
                                    v-for="(item,index1) in contactlist"
                                    :key="index1"
                                    :label="item.phone"
                                    :value="item.phone">
                                  </el-option>
                              </el-select>
            </el-col>
            <el-col class="interviewtrack1" style="width: 136px;">
              <el-input
                width="136px"
                v-model.trim="searchname"
                size="small"
                placeholder="请输入姓名"
                @keyup.enter.native="search"
              >
                <i slot="suffix" class="el-input__icon el-icon-search" style="cursor: pointer;" @click="search"></i>
              </el-input>
              <!--            <el-input-->
              <!--              v-model.trim="searchphone"-->
              <!--              size="small"-->
              <!--              placeholder="请输入电话"-->
              <!--              @keyup.enter.native="search1"-->
              <!--            >-->
              <!--              <i slot="suffix" class="el-input__icon el-icon-search" style="cursor: pointer;" @click="search1"></i>-->
              <!--            </el-input>-->
            </el-col>
          </el-row>
        </el-col>
      </el-row>
      <el-row type="flex" justify="center" style="padding-top: 15px;">
        <el-col :span="23">
          <el-table
            ref="singleTable"
            highlight-current-row
            :data="tableData"
            @current-change="handleCurrentChange"
          >
            <el-table-column
              label="推送客户"
              width="120">
              <template slot-scope="scope">
                <span style="color: #1198ff;cursor:pointer;"
                      @click="seedetails(scope.row)">{{scope.row.customerName}}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="需求编号"
              width="140">
              <template slot-scope="scope">
                <!-- prop="name" -->
                <span @click="seerequire(scope.row)"
                      style="color: #1198ff;cursor:pointer;">{{scope.row.requireNum}}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="postName"
              label="推送职位"
            >
            </el-table-column>
            <el-table-column prop="postLevel" label="职位级别"></el-table-column>
            <el-table-column prop="studentStatus" label="学历查询网站"></el-table-column>
            <el-table-column prop="area" label="所属区域"></el-table-column>
            <el-table-column label="姓名">
              <template slot-scope="scope">
                <!-- prop="name" -->
                <span><a class="other" :href="scope.row.group+'/'+scope.row.fileAddress" target="_blank">{{scope.row.name}}</a></span>
              </template>
            </el-table-column>
            <el-table-column label="毕业时间">
              <template slot-scope="scope">
                <span>{{scope.row.graduationTime | converTime("YYYY-MM")}}</span>
              </template>
            </el-table-column>
            <el-table-column label="出生年月">
              <template slot-scope="scope">
                <span>{{scope.row.birthday | converTime("YYYY-MM")}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="phone" label="联系方式"></el-table-column>
            <el-table-column prop="status" label="离职状态"></el-table-column>
            <el-table-column prop="" label="期望薪资">
              <template slot-scope="scope">
                <span
                  v-if="scope.row.customerName !== '港交所'">{{scope.row.expectSalary}}k*{{scope.row.expectSalaryNum}}</span>
                <span v-if="scope.row.customerName == '港交所'">无</span>
              </template>
            </el-table-column>
            <el-table-column label="到岗时间">
              <template slot-scope="scope">
                <span>{{scope.row.entryTime}}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="pusherName"
              label="推送人"
            >
            </el-table-column>
            <el-table-column label="推送时间">
              <template slot-scope="scope">
                <span>{{scope.row.createTime | converTime("YYYY-MM-DD")}}</span>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="initialEvaluation" label="初步评价" show-overflow-tooltip></el-table-column> -->
          </el-table>
          <div class="pager">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="pagehandleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[5,10,15]"
              :page-size="pagesize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="totalcount"
            ></el-pagination>
          </div>
        </el-col>
      </el-row>
    </div>
    
    <div v-if="type == 1">
      <resume-detail :detail-code="detailcode" v-show="addShow"></resume-detail>
    </div>
    
    <div v-if="type == 2">
      <job-Detail v-show="addShow" :detail-no="detailcode"></job-Detail>
    </div>
  </div>
</template>

<script>
  import axios from 'axios'
  import ResumeDetail from './resumedetail'
  import JobDetail from './jobdetail.vue'
  
  export default {
    name: "presentedresume",
    data() {
      return {
        tableData: [],
        currentPage: 1,
        pagesize: 15,
        totalcount: null,
        detailcode: null,
        type: null,
        addShow: false,
        secondshow: false,
        searchname: '',
        searchphone: '',
        name: '',
        namelist: [],
        customerName: '',
        customerNamelist: [],
        cusId : '',
        positionName: '',
        positionNamelist: [],
        arealist: [],
        area: '',
        time:'',
        contactlist:[],
        contact:'',
        // 禁止选中当日之后的日期
        pickerOptionsDate:{
          disabledDate(time) {
              return time.getTime() > Date.now() - 8.64e6
          }
      },
      }
    },
    created() {
      // 获取所有招聘专员下拉框
      axios.post(this.url + '/resumeUpload/selecthrnames').then(res => {
        this.unlogin(res.data.code);
        if (res.data.code == 200) {
          this.namelist = res.data.data;
          this.getPushedResumes();
        }
      })
      //客户名称下拉列表请求
      axios.get(this.url + "/resumeUpload/getCustomerName").then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.customerNamelist = res.data.data;
            this.customerNamelist.unshift('全部');
          }
        });
      //地区下拉列表请
      axios.get(this.url + "/demand/getAreas").then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.arealist = res.data.data;
            this.arealist.unshift("全部");
          }
        });
      //联系方式列表请求
      axios.get(this.url + "/resumeUpload/selectphone").then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.contactlist = res.data.data;
            this.contactlist.unshift({phone:"全部"});
          }
        });
    },
    methods: {
       getPushedResumes() {
        //获取已推送简历
          axios.post(this.url + '/resumeUpload/getPushedResumes', {
          pusher: this.name,
          name: this.searchname,
          customerName :this.customerName,
          position : this.positionName,
          area : this.area,
          pushTime:this.time,
          phone: this.contact,
          pageNum: this.currentPage,
          pageSize: this.pagesize
        }).then(res => {
          this.unlogin(res.data.code);
          if (res.data.code == 200) {
            this.addShow = false;
            this.secondshow = false;
            this.type = null;
            this.tableData = res.data.data.list;
            this.totalcount = res.data.data.total;
          }
        })
      },
      seedetails(val) {
        this.detailcode = val;
        this.addShow = true;
        this.secondshow = true;
        this.secondtitle = "查看简历详情";
        this.type = 1;
      },
      seerequire(val) {
        this.detailcode = val;
        this.addShow = true;
        this.secondshow = true;
        this.secondtitle = "查看需求详情";
        this.type = 2;
      },
      //点击表格行，获取当前行的数据
      handleCurrentChange(val) {
        this.currentRow = val;
      },
      //改变表格的页面展示数量
      handleSizeChange(val) {
        this.pagesize = val;
        this.getPushedResumes();
      },
      //修改当前表格页数
      pagehandleCurrentChange(val) {
        this.currentPage = val;
        this.getPushedResumes();
      },
      tableshow(row) {
        this.addShow = false;
        this.secondshow = false;
        this.$refs.singleTable.setCurrentRow(row);
        this.type = null;
      },
      selectname() {
        this.currentPage = 1;
        this.getPushedResumes();
      },
      selectcustomerName() {
        this.currentPage = 1;
        this.getPushedResumes();
        this.positionNamelist = [];
        this.positionName = '';

        // 职位名称下拉框请求
        axios.post(this.url + "/resumeUpload/getPostNameByCname", {
            customerId:  this.customerName
          })
          .then(res => {
            this.unlogin(res.data.code);
            if (res.data.code == 200) {
              this.positionNamelist = res.data.data;
              this.positionNamelist.unshift("全部");
            }
          });
      },
      selectpositionName() {
        this.currentPage = 1;
        this.getPushedResumes();
      },
      selectarea() {
        this.currentPage = 1;
        this.getPushedResumes();
      },
      selecttime(){
        this.currentPage = 1;
        this.getPushedResumes();
      },
      selectcontact() {
        this.currentPage = 1;
        this.getPushedResumes();
      },
      search() {
        this.currentPage = 1;
        this.getPushedResumes();
      },
    },
    components: {
      ResumeDetail,
      JobDetail
    },
    watch: {
      "searchname": function (val) {
        if (val == '') {
          this.currentPage = 1;
          this.getPushedResumes();
        }
      },
      // "searchphone": function (val) {
      //   if (val == '') {
      //     this.currentPage = 1;
      //     this.getPushedResumes();
      //   }
      // },
    }
  }
</script>

<style scoped>
  .title {
    background-color: #fff;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    padding-left: 20px;
    margin-top: 6px;
    margin-bottom: 6px;
  }
  
  .posttable {
    min-height: 700px;
    background-color: #fff;
  }
  
  .textactive {
    color: #1099ff;
  }
  
  
  .pager {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
  .el-pagination {
    margin-left: 50%;
    transform: translateX(-50%);
  }
  
  .other {
    color: #1198ff;
    cursor: pointer;
    text-decoration: none;
  }
</style>
